import React from 'react';

import router from '../../../utils/routerDecorator';
import {get, post} from '../../../logic/api';
import ObjectList from '../../components/ObjectList';

import styles from './main.less';
import Setsecret from './Setsecret';
import Setinfo from './Setinfo';

import QiniuUploadimage from '../../components/QiniuUploadimage';

@router('/site/user')
export default class User extends React.Component {

  state = {
  }
  
  componentWillMount(){ 
  }

  async fetchData(current, pageSize){
    return await get('/admin/user/userlist/' + current + "/" + pageSize);
  }

  genOperations(){
    return [{
      title:'操作',
      width:'20%', 
      render: (text, record) => {
        return <span className = {styles.operations}>
          <Setsecret record = {record}/>
          <Setinfo record = {record}/>
        </span>
      }
    }]
  }

  genColumns(){
    var typesExchange = {
      'normal':'普通用户',
      'supervisor':'超级管理员', 
      'admin':'管理员'
    }

    return [
      {width:'5%'},
      {title:'用户ID', dataIndex:'id', width:'15%'},
      {title:'用户类型', dataIndex:'type', width:'15%', render:(type) => (typesExchange[type]?typesExchange[type]:type)},
      {title:'手机号码', dataIndex:'mobile', width:'15%'},
      {title:'用户名', dataIndex:'name', width:'15%'},
      {title:'注册时间', dataIndex:'createdAt', width:'15%'},
    ].concat(this.genOperations());
  }
  
  render(){

    return <div>
      <ObjectList 
        columns = {this.genColumns()}
        fetchData = {this.fetchData}
      />
    </div>
  }
}